@charset "utf-8";
body {
    background-color: rgb(248, 249, 251);
}
body, html {
    width: 100%;
    height: 100%;
}
/*flexbox*/
.flex-v {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: column;
    flex-flow: column; }

.flex-h {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex; }

.flex-1 {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1; }

.x-between {
    -webkit-justify-content: space-between; 
    justify-content: space-between; 
}

.x-center {
    -webkit-justify-content: center; 
    justify-content: center; 
}

.y-center {
    -webkit-align-items: center; 
    align-items: center; 
}
.display-none {display: none;}


body {overflow: hidden;}
.demo-font {
    margin-top: 15%;
    text-align: center;
}
.font-set-footer { 
    width: 100%;
    height: 120px;
    padding: 0 14px;
    background: #fff;
}
.font-set-scroll { height: 11px; margin-top: 75px; }
.font-set-scroll > span{display: block;}
.font-14 {font-size: 14px;}
.font-20 {font-size: 20px;}
.font-12 {font-size: 12px;}
.pad-5 {padding: 10px 5px;}
.font-word {
    position: absolute;
    width: 30px;
    font-style: normal;
    text-align: center;
    margin: -35px 0 0 -15px;
    z-index: 10;
}
.dot {
    width: 1px;
    height: 11px;
    background: #B6B6B6;
}
.line {
    height: 1px;
    background: #B6B6B6;
}
.drug-dot {
    position: absolute;
    width: 24px;
    height: 24px;
    border-radius: 24px;
    background: #fff;
    box-shadow:0px 0px 8px 0px rgba(0,0,0,0.14);
    margin: 0 0 0 -12px;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    z-index: 9;
}